<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>密码：<input type="text" id="password"></div><span id="message"></span></div>
</body>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>

    const $password = $("#password");

    // 提交防抖
    let submitTimeoutId = null;

    // 自动关闭提示框
    let timeoutId = null;
    $password.on("input", function () {
        if (submitTimeoutId) {
            clearTimeout(submitTimeoutId);
        }


        // 用户输入间隔1000毫秒后，才发起请求
        submitTimeoutId = setTimeout(function () {
            // 异步请求
            $ajax({
                url: "",
                success: function () {

                },
                error: function () {
                    if (timeoutId) {
                        clearTimeout(timeoutId);
                    }
                    $message.show();
                    timeoutId = setTimeout(() => {
                        $message.hide();
                    }, 2000);
                }
            })
        },1000)

    });



</script>

</html>